<template>
  {{#if ctrl.psSysPFPlugin}}
    {{> @macro/plugins/widget/widget-use.hbs appPlugin=ctrl.psSysPFPlugin}}
  {{else}}
    <div :class="classNames" :id="controlID">
        <div class="control-header app-dataview__header">
        {{!-- todo 排序栏暂时注释 --}}
        </div>
        <AppDataView
            class="control-content app-dataview__content"
            :items="store.data"
            :cardOpts="{ 'width':{{ctrl.cardWidth}},'height':{{ctrl.cardHeight}},'cardColXS':{{ctrl.cardColXS}},'cardColSM':{{ctrl.cardColSM}},'cardColMD':{{ctrl.cardColMD}},'cardColLG':{{ctrl.cardColLG}} }"
            :totalRecord="store.totalRecord"
            :selections="store.selections"
    {{#if ctrl.emptyText}}
            emptyText="{{ctrl.emptyText}}"
    {{/if}}
    {{#if ctrl.emptyTextPSLanguageRes}}
            emptyTextPSLanguageRes="{{ctrl.emptyTextPSLanguageRes}}"
    {{/if}}             
            @item-click="handleItemClick"
            @item-db-click="handleItemDbClick"
            @selection-change="handleSelectionChange"
            @load-more="handleLoadMore"
            @item-action-click="(logic: any, data: IParam, event: MouseEvent) => handleActionClick(controller, logic, data, event)">
            {{#if ctrl.itemPSLayoutPanel}}
            <template #default="{ item }">
                {{> @macro/widgets/panel-detail/panel.hbs ctrl=ctrl.itemPSLayoutPanel props=":isLoadDefault='true'
                :data='item'"}}
            </template>
            {{/if}}
        </AppDataView>
  </div>
  {{/if}}
</template>
<script setup lang="ts">
// 基于template/src/widgets/\{{appEntities}}/\{{ctrls@DATAVIEW}}-data-view/\{{spinalCase ctrl.codeName}}-data-view.vue.hbs生成
{{> @macro/plugins/widget/widget-import.hbs ctrl=ctrl}}
import { AppDataView } from '@components/widgets/data-view';
{{#if ctrl.itemPSLayoutPanel}}
import {{ctrl.itemPSLayoutPanel.codeName}}Panel from '@widgets/{{spinalCase appEntity.codeName}}/{{spinalCase ctrl.itemPSLayoutPanel.codeName}}-panel/{{spinalCase ctrl.itemPSLayoutPanel.codeName}}-panel.vue';
{{/if}}
import { ICtrlDataAction, IContext, IParam, DataViewCtrlActionType, IDataViewCtrlAbility, IDataViewCtrlControllerParams, IDataViewCtrlController, IDataViewCtrlStore, DataViewCtrlController, createUUID, ILoadingHelper, IViewCtx } from '@/core';
import { useNavParamsBind, getCtrlClassNames, useEventBind, handleActionClick, {{#if ctrl.itemPSLayoutPanel}}handleCtrlInit, handleCtrlAction, handleCtrlDestroy,{{/if}} } from '@/hooks/use-ctrl';
import { {{pascalCase ctrl.name}}ControlVO } from './{{spinalCase ctrl.codeName}}-data-view-vo';
import { model } from "./{{spinalCase ctrl.codeName}}-data-view-model";
import DataViewService from "@/core/modules/ctrl-service/data-view-service";
{{> @macro/widgets/ctrl/ctrl-props.hbs
    props="singleSelect?: boolean;
    selectFirstDefault?: boolean;
    rowActiveMode?: 0 | 1 | 2;
    openView?: Function;
    newView?: Function;
    actions: ICtrlDataAction;
    "
    propsDefault="singleSelect: false,
    rowActiveMode: 2
    "
}}

{{> @macro/common/emit.hbs name="ctrl" actionType="DataViewCtrlActionType" ability="IDataViewCtrlAbility"}}
//  部件样式名
const classNames = computed(() => {
    return getCtrlClassNames(model, props);
});

const controlID = createUUID();
const params: IDataViewCtrlControllerParams<DataViewCtrlActionType, IDataViewCtrlAbility> = {
    name: props.name,
    model,
    evt,
    controlID,
    rowActiveMode: props.rowActiveMode,
    pLoadingHelper: props.pLoadingHelper,
    actions: props.actions,
    singleSelect: props.singleSelect,
    selectFirstDefault: props.selectFirstDefault,
    ctrlService: new DataViewService<{{pascalCase ctrl.name}}ControlVO>({{pascalCase ctrl.name}}ControlVO, model.entityCodeName),
    openView: props.openView,
    newView: props.newView,
    closeView: props.closeView,
    pViewCtx: props.pViewCtx,
    handler: (data: IDataViewCtrlStore) => { return reactive(data) }
};
{{> @macro/common/controller.hbs name="ctrl" IController="IDataViewCtrlController" store="IDataViewCtrlStore" ability="IDataViewCtrlAbility" controller="DataViewCtrlController"}}

const handleItemClick = (row: IParam, event: MouseEvent) => {
    controller.handleItemClick(row, event);
}

const handleItemDbClick = (row: IParam, event: MouseEvent) => {
    controller.handleItemDbClick(row, event);
}

const handleSelectionChange = (selections: IParam[]) => {
    controller.handleSelectionChange(selections);
}

const handleLoadMore = () => {
    controller.loadMore();
}

</script>